pub mod iterator_t {
    use yew::{html, Html, Component};
    pub struct IteratorComp;

    impl Component for IteratorComp {
        type Message = ();

        type Properties = ();

        fn create(_ctx: &yew::Context<Self>) -> Self {
            Self
        }

        fn view(&self, _ctx: &yew::Context<Self>) -> Html {
            let items = (1..=10).collect::<Vec<_>>();
            // html! include html!
            html!{
                <div>
                    <ul class="item-list-items">
                        {items.iter().map(|x| html!{<li>{x}</li>}).collect::<Html>()}
                    </ul>
                    <ul class="item-list-for">
                        {for items.iter().map(|x| html!{<li>{x}</li>})}
                    </ul>
                </div>
            }
        }
    }

    pub struct KeyListComp;
    impl Component for KeyListComp {
        type Message = ();

        type Properties = ();

        fn create(_ctx: &yew::Context<Self>) -> Self {
            Self
        }

        fn view(&self, _ctx: &yew::Context<Self>) -> Html {
            let names = vec!["Sam", "Bob", "Ray"];
            html!{
                <div id="introduction">
                    {
                        names.into_iter().map(|name| {
                            html!{
                                <div key={name}>{format!{"Hello {}", name}}</div>
                            }
                        }).collect::<Html>()
                    }
                </div>
            }
        }
    }
}